<template>
	<!-- 可拖动 -->
	<movable-area class="movableArea" >
		<movable-view class="movableView" direction="all" x="600rpx" y="800rpx" :y='wxWindowHeight-30' :x="wxWindowWidth-30">
			<view class="linear" @click="add">
				<image src="../../static/issue.png" mode=""></image>
			</view>
		</movable-view>
	</movable-area>
</template>

<script>
	import {
		capsuleTopHeight
	} from "../../mixins/mixins.js"
	export default {
		props:{
			x:{
				type: String,
			},
			y:{
				type: String,
			}
		},
		data() {
			return {
				wxWindowWidth:0,
				wxWindowHeight:0
			};
		},
		created() {
			let width= uni.getSystemInfoSync().windowWidth-30
			this.wxWindowWidth=width
			const height = uni.getSystemInfoSync().windowHeight-30
			this.wxWindowHeight=height
		},
		methods:{
			add(){
				this.$emit('dragClick')
			}
		}
	}
</script>

<style lang="scss">
.movableArea {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		pointer-events: none; //设置area元素不可点击，则事件便会下移至页面下层元素
		z-index: 999;
	
		.movableView {
			pointer-events: auto; //可以点击
			width: 96upx;
			height: 96upx;
			.linear{
				width: 96upx;
				height: 96upx;
				border-radius: 100%;
				background-image: linear-gradient(45deg, #3FD3D1,#03f4f4);
				display: flex;
				align-items: center;
				justify-content: center;
				image {
					width: 72upx;
					height: 72upx;
				}
			}
		}
	}
</style>
